<template>
  <div class="creApplicitonDetail">
    <a-card class="card_box" title="申请详情">

      <a-row>
        <a-col :span="8">
          <a-descriptions class="margin-top" :column="1">
            <a-descriptions-item label="企业名称">{{ companyInfo.name }}</a-descriptions-item>
            <a-descriptions-item label="经营范围">{{ companyInfo.natureBusiness }}</a-descriptions-item>
            <a-descriptions-item label="企业网址">{{ companyInfo.site }}</a-descriptions-item>
            <a-descriptions-item label="注册资本">{{ companyInfo.registeredCapital }}万元</a-descriptions-item>
            <a-descriptions-item label="企业简介">
              {{ companyInfo.companyProfile }}
            </a-descriptions-item>
            <a-descriptions-item label="联系人">{{ applyInfo.linkMan }}</a-descriptions-item>
            <a-descriptions-item label="联系方式">{{ applyInfo.linkTel }}</a-descriptions-item>
            <a-descriptions-item label="公司地址">{{ companyInfo.address }}</a-descriptions-item>
            <a-descriptions-item label="开户银行">{{ applyInfo.depositBank }}</a-descriptions-item>
            <a-descriptions-item label="开户行帐号">{{ applyInfo.depositBankNo }}</a-descriptions-item>
            <a-descriptions-item label="附言">{{ applyInfo.postscript }}</a-descriptions-item>
          </a-descriptions>
        </a-col>
        <a-col :span="16">
          <a-descriptions :column="1">
            <a-descriptions-item label="申请资料">
              <div v-for="(item, index) in getFiles(applyInfo.financialStatements)" :key="index">
                <a-button type="link" target="_blank" :href="item.fileUrl">{{
                  item.fileName }}</a-button>
              </div>


            </a-descriptions-item>
            <!-- <a-descriptions-item label="经营计划">
              <a-button type="link" target="_blank" :key="index"
                v-for="(item, index) in getFiles(applyInfo.businessPlan)" :href="item.fileUrl">{{
                  item.fileName }}</a-button>
            </a-descriptions-item>
            <a-descriptions-item label="资产负债表">
              <a-button type="link" target="_blank" :key="index"
                v-for="(item, index) in getFiles(applyInfo.balanceSheet)" :href="item.fileUrl">{{
                  item.fileName }}</a-button>
            </a-descriptions-item>
            <a-descriptions-item label="现金流量表">
              <a-button type="link" target="_blank" :key="index"
                v-for="(item, index) in getFiles(applyInfo.cashTatement)" :href="item.fileUrl">{{
                  item.fileName }}</a-button>
            </a-descriptions-item> -->

          </a-descriptions>
        </a-col>
      </a-row>
    </a-card>

    <a-card class="card_box" title="信贷融资管理">
      <div class="card_box_title">
        基本信息
      </div>
      <a-descriptions class="margin-top" :column="1">
        <a-descriptions-item label="服务名称">{{ prodInfo.name }}</a-descriptions-item>
        <a-descriptions-item label="服务类型">{{ prodcutTypeName }}</a-descriptions-item>
        <a-descriptions-item label="贷款方式">{{ loanTypeName }}</a-descriptions-item>
        <a-descriptions-item label="融资期限">{{ prodInfo.financingTerm }}</a-descriptions-item>
        <a-descriptions-item label="融资额度">{{ prodInfo.financingAmount }}万元</a-descriptions-item>
        <a-descriptions-item label="截止日期">{{ prodInfo.closeDate }}</a-descriptions-item>
        <a-descriptions-item label="参考利率">{{ prodInfo.rate }}</a-descriptions-item>
        <a-descriptions-item label="服务概述">{{ prodInfo.desc }}</a-descriptions-item>
        <a-descriptions-item label="服务链接">{{ prodInfo.linkAddress }}</a-descriptions-item>
        <a-descriptions-item label="联系人">{{ prodInfo.contact }}</a-descriptions-item>
        <a-descriptions-item label="联系方式">{{ prodInfo.contactNumber }}</a-descriptions-item>
      </a-descriptions>
      <div class="card_box_title">
        服务介绍
      </div>
      <div>
        <div v-html="prodInfo.productDetails"></div>
      </div>
    </a-card>

    <a-card class="card_box" title="审核结果">


      <a-descriptions :column="1" v-if="flg === 'detail' || flg === 'submit'">
        <a-descriptions-item label="审核结果">
          <a-tag v-if="applyInfo.approvalStatus == 0" color="orange">待审核</a-tag>
          <a-tag v-if="applyInfo.approvalStatus == 1" color="blue">已通过</a-tag>
          <a-tag v-if="applyInfo.approvalStatus == 2" color="red">未通过</a-tag>
        </a-descriptions-item>
        <a-descriptions-item label="审批记录">
          <a-button style="padding: 0;" type="link" @click="openApprovalList(applyInfo)">查看详情</a-button>
        </a-descriptions-item>
      </a-descriptions>

      <a-form v-if="flg === 'approval'" ref="form" :model="form" :rules="rules">
        <a-form-item label="审核结果" prop="approvalStatus">
          <a-select v-model="form.approvalStatus" placeholder="请选择审核状态">
            <a-select-option label="请选择" :value="''"></a-select-option>
            <a-select-option label="通过" :value="1"></a-select-option>
            <a-select-option label="驳回" :value="2"></a-select-option>
          </a-select>
        </a-form-item>
        <a-form-item v-if="form.approvalStatus == 2" label="驳回理由" prop="approvalRejection">
          <a-input style="width:520px" v-model="form.approvalRejection" :maxLength="200" type="textarea"
            placeholder="请输入驳回理由" />
        </a-form-item>

      </a-form>



    </a-card>

    <a-card v-if="applyInfo.contractSt" class="card_box" title="合作跟进">

      <a-descriptions class="margin-top" :column="1">
        <a-descriptions-item label="合作状态">
          <a-tag v-if="applyInfo.contractSt == 1" color="blue">达成合作</a-tag>
          <a-tag v-if="applyInfo.contractSt == 2" color="orange">取消合作</a-tag>
        </a-descriptions-item>
        <a-descriptions-item v-if="applyInfo.contractSt == 1" label="放款金额">{{ applyInfo.loanAmount
          }}万元</a-descriptions-item>
        <a-descriptions-item v-if="applyInfo.contractSt == 1" label="还款期次">{{ applyInfo.repayment
          }}</a-descriptions-item>
        <a-descriptions-item v-if="applyInfo.contractSt == 1" :span="2" label="合作合同/其他证明件"
          :contentStyle="{ display: 'block' }">
          <div class="file-list">
            <a-button type="link" v-for="file, index in applyInfo.files" :key="index" :href="file" target="_blank">
              {{ getfileName(file) }}
            </a-button>
            &nbsp;
          </div>


        </a-descriptions-item>
        <a-descriptions-item label="备注">{{ applyInfo.remark }}</a-descriptions-item>

      </a-descriptions>

    </a-card>

    <a-card class="card_box ">
      <a-button v-if="flg !== 'detail'" type="primary" @click="submitForm">
        <span v-if="flg === 'approval'">确 定</span>
        <span v-if="flg === 'submit'">提 交</span>
      </a-button>
      <a-button @click="cancel">返 回</a-button>
    </a-card>

    <ApprovalHistory @close="approvalHistoryClose" :visible="approvalHistoryShow" :rows="approvalHistoryRows"
      :title="approvalHistoryTitle" />


  </div>
</template>
<script>
import { getCompaynInfo } from "@/apis/com/company";
import { creApplicationById } from "@/apis/cre/creApplication"
// import { addCreApplicationApproval, updateCreApplicationApproval } from "@/api/credit/creApplicationApproval"
import { getClientCreInfo } from "@/apis/cre/crePord"
import ApprovalHistory from './ApprovalHistory.vue'
import { listCreApplicationApproval } from '@/apis/cre/creApplicationApproval'
import { getDicts } from "@/apis/system";
export default {
  components: { ApprovalHistory },
  data () {
    return {
      companyId: null,
      companyInfo: {},
      appalyId: null,
      applyInfo: {},
      prodInfo: {},
      prodcutTypes: [],
      loanTypes: [],
      form: {
        approvalStatus: '',
        approvalRejection: ''
      },
      rules: {
        approvalStatus: [
          { required: true, message: "审核结果不能为空", trigger: "blur" }
        ],
        approvalRejection: [
          { required: true, message: "驳回理由不能为空", trigger: "blur" }
        ],
      },
      approvalHistoryShow: false,
      approvalHistoryRows: [],
      approvalHistoryTitle: '',

    }
  },
  created () {
    this.companyId = this.$route.query.companyId
    this.appalyId = this.$route.query.id
    this.flg = this.$route.query.flg
    this.getCompanyInfo();
    this.getApplyInfo()
    this.getProdcutTypes()
    this.getLoanTyypes()
  },

  computed: {

    prodcutTypeName () {
      if (this.prodcutTypes.length <= 0) return ''
      if (!this.prodInfo.type) return ''
      return this.prodcutTypes.find(item => item.dictValue == this.prodInfo.type).dictLabel
    },

    loanTypeName () {
      if (this.loanTypes.length <= 0) return ''
      if (!this.prodInfo.loanType) return ''
      return this.loanTypes.find(item => item.dictValue == this.prodInfo.loanType).dictLabel
    },
  },

  methods: {
    async openApprovalList (row, type) {
      const params = {
        applicationId: row.id,
        pageNumber: 1,
        pageSize: 5,
      }
      const res = await listCreApplicationApproval(params)
      console.log('openComApproval', res);
      if (res.code === 200) {
        console.log('res.rows', res.rows);
        this.approvalHistoryRows = res.rows.map(item => {

          if (item.approvalType == 2 && item.approvalStatus == 0) {
            item.approvalType = 1
            item.approvalStatus = 1
          }
          if (item.approvalType == 3 && item.approvalStatus == 0) {
            item.approvalType = 2
            item.approvalStatus = 1
          }



          return item
        })

        console.log('this.approvalHistoryRows', this.approvalHistoryRows);


        // this.approvalHistoryRows = res.rows
        this.approvalHistoryShow = true
        this.approvalHistoryTitle = row.name
      }
    },
    approvalHistoryClose () {
      this.approvalHistoryRows = []
      this.approvalHistoryShow = false
      this.approvalHistoryTitle = ''

    },
    getfileName (url) {
      const idx = url.lastIndexOf("/")
      return url.substring(idx + 1)
    },

    cancel () {
      console.log('cancel');

      this.$router.back()
      // const obj = { path: "/monitor/job" };
      // this.$tab.closeOpenPage(obj);
    },
    /** 获取信贷产品类型字典 */
    async getProdcutTypes () {
      const { data } = await getDicts("cre_product_type");
      this.prodcutTypes = data
      console.log('this.prodcutTypes', this.prodcutTypes);
    },

    /** 获取贷款类型字典 */
    async getLoanTyypes () {
      const { data } = await getDicts("cre_loan_type");
      this.loanTypes = data
    },
    getFiles (fileItem) {
      if (!fileItem) return ''
      return JSON.parse(fileItem)
    },

    async getCompanyInfo () {
      const res = await getCompaynInfo(this.companyId)
      console.log('getCompanyInfo', res);

      this.companyInfo = res.data
    },
    async getApplyInfo () {
      const res = await creApplicationById(this.appalyId)
      console.log('getApplyInfo', res);
      const prodId = res.data.productId
      const prodRes = await getClientCreInfo(prodId)
      this.prodInfo = prodRes.data
      console.log('prodInfo', this.prodInfo);
      if (res.data.contractDoc) {
        const files = res.data.contractDoc.split(',')
        res.data.files = files
      }


      this.applyInfo = res.data
    },

    /** 审核 */
    handleApproval () {
      this.$refs["form"].validate(valid => {
        console.log('valid', valid);
        if (valid) {
          const params = {
            applicationId: this.applyInfo.id,
            approvalStatus: this.form.approvalStatus,
            approvalRejection: this.form.approvalRejection,
            approvalType: this.applyInfo.applicationStatus
          }

          console.log('params', params);
          addCreApplicationApproval(params).then(response => {
            this.$modal.msgSuccess("修改成功");
            this.cancel()
          });
        } else {
          console.log('valid', valid);
        }
      });



    },
    /** 提交审核 */
    async handleSubmit () {
      let applicationStatus = ''

      if (Number(this.applyInfo.applicationStatus) == 3) {
        return
      } else {
        applicationStatus = `${Number(this.applyInfo.applicationStatus) + 1}`
      }
      const params = {
        id: this.applyInfo.id,
        approvalStatus: 0,
        applicationStatus,

      }

      console.log('params', params);
      updateCreApplication(params).then(response => {
        this.cancel()
        this.$modal.msgSuccess("操作成功");
      })
    },
    /** 提交按钮 */
    submitForm () {
      if (this.flg == 'approval') {
        this.handleApproval()
      }
      if (this.flg == 'submit') {
        this.handleSubmit()
      }



    },
  }
}
</script>
<style scoped>
.creApplicitonDetail {
  padding: 0 20px;
}

.clearfix span {
  font-weight: 700;
  font-size: 16px;
}

.card_box {
  margin: 20px 0;
}

.card_box_title {
  background-color: rgb(246, 247, 250);
  height: 50px;
  margin: 20px 0;
  line-height: 50px;
  padding-left: 10px;
  font-weight: 700;
}

::v-deep .a-descriptions-item__container {
  align-items: center;
}

.text-align-center {
  text-align: center;
}

.file-list {
  display: flex;
  flex-direction: column;
  align-items: baseline;
  justify-content: flex-start;
}

::v-deep .ant-descriptions-item {
  display: flex;
  /* align-content: center; */
  align-items: baseline;
}
</style>